<template>
  <!--深色模式开关-->
  <el-switch v-model="theme" :active-icon="Sunny" :inactive-icon="Moon" class="m-3.5" inline-prompt
             style="--el-switch-on-color: #13ce66; --el-switch-off-color: #064E3B"
             @click="changeTheme" />
</template>

<script lang="ts" setup>
import { Moon, Sunny } from "@element-plus/icons-vue";
import { ref } from "vue";

const theme = ref(!document.documentElement.classList.contains("dark"));


const changeTheme = () => {
  if (theme.value === false) {
    document.documentElement.classList.add("dark");
  } else {
    document.documentElement.classList.remove("dark");
  }
};
</script>

<style scoped>

</style>
